<script setup>
import { computed } from 'vue';
import { useRouter } from 'vue-router';
import Header from "@/components/Header.vue";
import { RouterView } from 'vue-router';

const router = useRouter();
const isRegisterPage = computed(() => {
  return ['注册','注册信息填写'].includes(router.currentRoute.value.name);
});
const isLoginPage = computed(() => {
  return ['登录','手机号登录','微信登陆','微信绑定','用户绑定手机'].includes(router.currentRoute.value.name);
});
</script>

<template>
  <div class="container">
    <!-- 如果不是注册相关页面，则显示 Header 组件 -->
    <Header v-if="!isRegisterPage && !isLoginPage"/>
    <div class="main">
      <RouterView/>
    </div>
  </div>
</template>

<style scoped>
.container {
  display: flex;
  flex: 1;
  flex-direction: column;
  overflow-y: scroll;
}

/*滚动条整体样式*/
.container::-webkit-scrollbar {
  width: 5px;
  height: 1px;
}

/*滚动条里面小方块*/
.container::-webkit-scrollbar-thumb {
  border-radius: 10px;
  background: #CCCCCC;
}

/*滚动条里面轨道*/
.container::-webkit-scrollbar-track {
  background: #FFF;
}

.main {
  display: flex;
  flex: 1;
  user-select: none;
}
</style>
